{% extends 'layout.html' %}

{% block title %}{% endblock %}

{% block css %}{% endblock %}

{% block content %}
<div id="wrap">

  <div class="container wrap">
    <ol class="breadcrumb">
      <li class="active"><i class="web-icon wi"></i>搜索 <strong style="color: red;">{{SearchText}}</strong> 的结果 </li>
    </ol>
    <main class="main">
      <section class="sec-panel sec-panel-default">
        <div class="sec-panel-body">
          <ul class="post-loop post-loop-default cols-0" id="ID-flow-demo">
            <!-- {% for obj in data %}
            <li class="item">
              <div class="item-img">
                <a class="item-img-inner" href="/yyty/news/info/?pid={{obj.topicId}}" title="{{obj.title}}">
                  <img width="480" height="300"
                    class="attachment-default size-default wp-post-image j-lazy"
                    alt="{{obj.title}}" data-src="{{obj.attachments.0.remoteUrl}}">
                </a>
              </div>
              <div class="item-content">
                <h2 class="item-title"> <a href="/yyty/news/info/?pid={{obj.topicId}}"> {{obj.title}} </a></h2>
                <div class="item-excerpt">
                  <p> {{obj.liteContent}} </p>
                </div>
                <div class="item-meta">
                  <div class="item-meta-li author">
                    <a href="/yyty/news/info/?pid={{obj.topicId}}" class="avatar j-user-card"> <span>作者：yy</span> </a>
                  </div>
                  <span class="item-meta-li date">时间：{{obj.lastCommentTime}}</span>
                </div>
              </div>
            </li>
            {% endfor %} -->

          </ul>
          <div class="dede_pages">
            <ul>
              资源共享 -yy
            </ul>
          </div>
        </div>
      </section>
    </main>

  </div>
</div>
{% endblock %}

{% block js %}
<script>
const nameg = "search_item";

  // const generator = new UniqueRandomGenerator(1, 50);
  window.onload = function () {
    // 都本地
    function Gsolca() {
      
      let newsetiusa = [{ "page": 1, "title": "{{SearchText}}" }];
      let s = localStorage.getItem(nameg);
      if (s != null) {
        // 本地有记录，请转换成js格式
        let new_s = JSON.parse(s);
        // 循环列表, 判断当前的值中是否有相同的搜索记录
        let sudo = new_s.filter(item => item.title == "{{SearchText}}");
        // 判断长度, 如果长度大于0则说明有一模一样的搜索记录
        if (sudo.length > 0) {
          console.log("当前的关键字以前搜索过");
          // 读取page和名字
          let upage = sudo[0].page;
          let utitle = sudo[0].title;
          //提示用户
          let ioarray = layer.alert(`以前看过相同的  <span style="color:red;font-size:18px;">${utitle}</span>  历史噢, 是否加载到以前的地方观看?否则将清空以前的历史记录。<br/><br/>    <span style="color:red;font-size:18px;">请注意,由于某种限制, 如果时间时长相隔太远可能导致不精致, 如果你遇到了此情况, 可以继续往下观看即可!  </span> `, {
            btn: ['加载', '算了'],
            icon: 3,
            shade: [0.6, "#4a8af4"],
            btnAlign: 'c', // 按钮居中显示
            btn1: function () {
              layer.msg(` <i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop"></i>  正在为你加载之前的浏览页`);
              sassas(upage);
            },
            btn2: function () {
              layer.msg('好的');
              sassas(1);
            },
            cancel: function (index, layero, that) {
              layer.msg('好的');
              sassas(1);
              layer.close(index);
            }

          });



        } else {
          console.log("当前的关键字以前没有搜索过,已添加进本地存储");
          let aghjk = { "page": 1, "title": "{{SearchText}}" };
          let xio = [].concat(new_s, aghjk);
          sassas(1);
          localStorage.setItem(nameg, JSON.stringify(xio));
        }
      } else {
        localStorage.setItem(nameg, JSON.stringify(newsetiusa));
        sassas(1);
        console.log(`%c由于你之前并没有搜索过  %c${"{{SearchText}}"}  %c关键字, 现在已为你添加进本地中. yy`, "color:#1e80ff;font-size:16px;", "color:red;", "color:#1e80ff;font-size:16px;");
      }
    }

    function sassas(oppage) {
      layui.use(function () {
        var flow = layui.flow;
        // 流加载实例
        flow.load({
          elem: '#ID-flow-demo', // 流加载容器
          // scrollElem: '#ID-flow-demo', // 滚动条所在元素，一般不用填，此处只是演示需要。
          done: function (page, next) { // 执行下一页的回调
            let lis = [];
            
            axios({
              url: "/yyty/news/search/",
              method: "POST",
              headers: {
                "Content-Type": "application/x-www-form-urlencoded"
              },
              data: {
                "Page": oppage,
                "SearchText": "{{SearchText}}"
              }
            }).then(res => {
              res.data.data.map((item, index) => {

                let sghjass = "";
                if (item.attachments != null) {
                  item.attachments.length <= 0 ? sghjass = "https://p.hjpfe1.com/hjstore/images/20240409/1fc76f4264e5104f42ab54916189665a_mini.jpg.txt" : sghjass = item.attachments[0].remoteUrl
                } else {
                  sghjass = "https://p.hjpfe1.com/hjstore/images/20240409/1fc76f4264e5104f42ab54916189665a_mini.jpg.txt"
                }
                let a = `
                            <li class="item">
                                <div class="item-img">
                                  <a class="item-img-inner" href="/yyty/news/info/?pid=${item.topicId}" title="${item.title}">
                                    <img width="480" height="300"
                                      class="attachment-default size-default wp-post-image j-lazy"
                                      alt="${item.title}" data-src="${sghjass}">
                                  </a>
                                </div>
                                <div class="item-content">
                                  <h2 class="item-title"> <a href="/yyty/news/info/?pid=${item.topicId}"> ${item.title} </a></h2>
                                  <div class="item-excerpt">
                                    <p> ${item.liteContent} </p>
                                  </div>
                                  <div class="item-meta">
                                    <div class="item-meta-li author">
                                      <a href="/yyty/news/info/?pid=${item.topicId}" class="avatar j-user-card"> <span>作者：yy</span> </a>
                                    </div>
                                    <span class="item-meta-li date">时间：${item.lastCommentTime}</span>
                                  </div>
                                </div>
                              </li>
                            `;
                lis.push(a);
              });
              next(lis.join(''), oppage < 50);
              let imgarr = document.querySelectorAll("#ID-flow-demo img");
              for (let i = 0; i < imgarr.length; i++) {
                const element = imgarr[i].dataset.src;
                p(element, imgarr[i])

              }
              gasadfasd(oppage, "{{SearchText}}")
              oppage+=1;
              

            }).catch(error => {
              console.error("请求失败", error);
            });


          }
        });
      });
    }

    // 更新本地记录
    function gasadfasd(params,sas) {
      let ioas = {"page":params,"title": sas};

      let g = JSON.parse(localStorage.getItem(nameg));

      // 排除当前的关键字
      let u = g.filter(item => item.title != sas);

      let sasc = [].concat(u, ioas);
      localStorage.setItem(nameg,JSON.stringify(sasc))
    }
    Gsolca();
  }
</script>

{% endblock %}